import React, { useEffect,forwardRef,useImperativeHandle } from 'react'
import {Avatar, List} from "antd";
import useCommentData from "./hooks/useCommentData";
const Comment = forwardRef(({ newsId },ref) => {
    const { getData,commentData, loading } = useCommentData()
    useEffect(()=> {
        getCommentList()
    },[])
    const getCommentList = () => {
        getData({
            comment_news_id: newsId,
            comment_status: 1
        })
    }
    useImperativeHandle(ref, () => ({
        refreshComment: getCommentList
    }))
    return (
        <div className={"comment-list"}>
            <List
                locale={ {emptyText: "快来抢占沙发吧"}}
                itemLayout="horizontal"
                dataSource={commentData}
                renderItem={(item, index) => (
                    <List.Item>
                        <List.Item.Meta
                            avatar={<Avatar src={`https://api.dicebear.com/7.x/miniavs/svg?seed=${index}`} />}
                            title={`${item.comment_user_name}  | ${item.comment_user_email} | ${item.comment_date}`}
                            description={item.comment_content}
                        />
                    </List.Item>
                )}
            />
        </div>
    )
})

export default Comment
